<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
%>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>垃圾分类查询</title>
<link href="<%=path%>/static/css/all.css?39230239j" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="<%=path%>/backstatic/lib/My97DatePicker/4.8/WdatePicker.js"></script>
    <script type="text/javascript" src="<%=path%>/backstatic/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="<%=path%>/backstatic/lib/laypage/1.2/laypage.js"></script>
<script>DD_belatedPNG.fix('*');</script>
</head>
<body>
<header>
<div id="topnav">
 <jsp:include page="/web/inc/header"></jsp:include>
  </div>
</header>
<section>
<div class="wrap">
<div class="section">
    <article id="datalist">
      <div id="title">
      <h1>添加数据</h1>
      <label>垃圾名称</label><label style="cursor:pointer;float: right;" onclick="history.go(-1)">返回列表</label>
    </div>
    <datalist>
        <form method="post" action="<%=path%>/web/garbage/insertData" id="submitForm">
      <dl>
        <dt>名称</dt>
        <dd><input class="find"   id="" type="text" aria-label="系统匹配废弃物名称" placeholder="系统匹配废弃物名称">
            <input class="hidener" name="garbage.id" type="hidden">
            <input type="hidden" name="userinfo.id" value="${sessionScope.userinfo.id}">
            <a id="match" href="script:void(0);" onclick="findGarbage()">匹配</a>
        </dd>
      </dl>
        <dl  id="result">

        </dl>
        <dl>
            <dt>发生地</dt>
            <dd>
                <select class="province" >
                    <option >请选择省</option>
                    <c:forEach items="${requestScope.provinces}" var="province">
                        <option value="${province.id}">${province.name}</option>
                    </c:forEach>
                </select>
                <select class="city" name="city.id">
                    <option value="">请选择市</option>
                </select>
            </dd>
        </dl>
      <dl>
        <dt>产生时间</dt>
        <dd> <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'logmax\')||\'%y-%M-%d\'}' })"  id="dataEvent" name="time" class="input-text Wdate" style="width:120px;">
            <input type="hidden" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'logmin\')}',maxDate:'%y-%M-%d' })" id="logmax" name="endTime" value="${param.endTime}" class="input-text Wdate" style="width:120px;"></dd>
      </dl>
      <dl>
        <dt>产生量（单位/t）</dt>
        <dd>
            <input class="number1" name="outCount" value="" type="text" aria-label="输入数值" placeholder="输入数">
        </dd>
      </dl>
      <dl>
          <dt>回收量（单位/t）</dt>
          <dd>
              <input class="number2" name="recycleCount" value="" type="text" aria-label="输入数值" placeholder="输入数">
          </dd>
      </dl>
      <div class="submit">
          <input type="button"  id="sub" value="提交">
          <input type="reset"  id="submit2" value="重置">
      </div>
  </form>
    </datalist>
  </article>
</div>
</div>
</section>
 <jsp:include page="/web/inc/footer"></jsp:include>
<script src="<%=path%>/static/js/layui/layui.all.js"></script>
<script src="<%=path%>/static/js/jquery-3.3.1.min.js"></script>
<script>
    //给匹配加点击事件，调用ajax进行模糊查询
   function findGarbage() {
       var text=$(".find").val();
       if(text.trim()==""){
           layer.msg("请输入匹配内容",{inco:5});
        }
       else{
           $.get("<%=path%>/web/garbage/matchName",{name:text},function (data) {
               $("#result").html(data);
               var flag=$(".flag").val();
               if(flag=="false")
               {
                   $("#result").html("没有找到匹配项，您可以选择先"+"<a style='color:red;' href='<%=path%>/web/garbage/addGarbage'>添加垃圾</a>"+"或者重新搜索");
               }
           });
       }
   }
   //省市联动
 $(function () {
     $(".province").change(function () {
         var id=$(this).val();
         $(".city").empty();
         $.ajax({
             url:"<%=path%>/web/garbage/findCity",
             data:{id:id},
             type:"GET",
             success:function (data) {
                 $(".city").append("<option value=''>请选择市</option>");
                 $(data).each(function () {
                     $(".city").append("<option value="+this.id+">"+this.name+"</option>");
                 });
             }
         });
     });
 })
    //表单提交，判断所有内容是否都填了
    $(function () {
        $("#sub").click(function () {
            var id=$(".find").attr("id");
            var cityId=$(".city").val();
            var date=$("#dataEvent").val();
            var number1=$(".number1").val();
            var number2=$(".number2").val();
            var val=$('input:radio[name="eventType"]:checked').val();
            if(id==""){
                layer.msg("请匹配对应的垃圾名称",{icon: 5});
                return;
            }
            if(cityId==""){
                layer.msg("请选择所属城市",{icon:5});
                return;
            }
            if(date=="") {
                layer.msg("请输入垃圾产生或回收的时间",{inco:5});
                return;
            }
            if(number1==""){
                layer.msg("请输入产生数量",{inco:5});
                return;
            }
            if(number2==""){
                layer.msg("请输入回收数量",{inco:5});
                return;
            }
            $("#submitForm").submit();

        });

    });


</script>


</body>
</html>
